Layer properties

Layer properties

Use Layer properties to specify the location, visibility, stacking order, and other layer options.

To see all of the following properties, click the expander arrow in the lower right corner of the Property inspector.

Name is the unlabeled box on the left side of the Property inspector. Enter a name to identify the layer for scripting and in the Layer inspector. Use only standard alphanumeric characters for a layer name. Do not use special characters such as spaces, hyphens, slashes, or periods.

L and T specifies the location of the layer from the top left corner of the page or parent layer.

W and H specifies the width and height of the layer. The actual size of the layer depends on the size of the browser window. These values are overridden if the content of the layer exceeds the specified size. The Overflow setting controls how layers are changed when the content exceeds the layer's size.

For CSS layers, the default values for location and size are in pixels. You can also specify the following units: pc (picas), pt (points), in (inches), mm (millimeters), cm (centimeters), or % (percentage of the parent's value). The abbreviations must follow the value without a space, for example, 3mm.

Z-ind determines the stacking order of the layer. Higher numbered layers appear above lower numbered layers. Values can be positive or negative. It's easier to change the stacking order of layers using the Layers palette than to enter specific Z-index values. See Changing the stacking order of layers.

Netscape layers (those with the LAYER or ILAYER tag) can also be stacked relative to other layers on the page. When you select a Netscape layer, two additional options appear in the lower right corner of the Property inspector. Use the A/B option to select a relative stacking position, and then choose the name of another layer from the pop-up menu directly on the right.

Vis determines the initial display condition of the layer. Use the visibility property in a scripting environment, such as JavaScript, to dynamically display layer contents. Choose from the following options:

Default does not specify a visibility property, but most browsers interpret this as inheriting the parent's value.

Inherit uses the visibility property of the layer's parent.

Visible displays the layer contents, regardless of the parent's value.

Hidden displays the layer content as transparent, regardless of the parent's value. Note that hidden layers still take up the same space as if they were visible.

Bg Image specifies a background image for the layer. Type the path for the image in the text box or click the folder icon to select a source image.

Bg Color specifies a background color for the layer. Leave blank to specify transparent.

Tag determines if the layer is a CSS layer or a Netscape layer. SPAN and DIV create CSS layers, LAYER and ILAYER create Netscape layers. See also Dynamic HTML overview.

Overflow (CSS layers only) determines what happens if the contents of a layer exceed its size. Choose from the following options:

Visible increases the layer size so that all of its contents are visible. The layer expands down and to the right.

Hidden maintains the layer's size and clips any content that doesn't fit. No scroll bars are provided.

Scroll adds scroll bars to the layer whether or not the contents exceed the layer's size. Specifically providing scroll bars avoids problems with them appearing and disappearing in a dynamic environment. This option works only in browsers that support scroll bars.

Auto makes scroll bars appear only when the layer's contents exceed its boundaries.

Clip defines the part of the layer that is visible.

Use Top, Left or PageX, PageY (Netscape layers only) lets you position a layer in relation to its parent. The former option places the layer in relation to the top left corner of its parent. The latter option places the layer in the absolute location relative to the top left corner of the page, whether or not it is in a nested layer.

Source (Netscape layers only) lets you display another HTML document within the layer. Type the path of the document or click the folder icon to browse to and select the document. Note that Dreamweaver does not display this property in the Document window.

A/B (Netscape layers only) specifies layers above and below the current layer in the stacking order (Z-index).

	Default does not specify a visibility property, but most browsers interpret this as inheriting the parent's value.
	Inherit uses the visibility property of the layer's parent.
	Visible displays the layer contents, regardless of the parent's value.
	Hidden displays the layer content as transparent, regardless of the parent's value. Note that hidden layers still take up the same space as if they were visible.

	Visible increases the layer size so that all of its contents are visible. The layer expands down and to the right.
	Hidden maintains the layer's size and clips any content that doesn't fit. No scroll bars are provided.
	Scroll adds scroll bars to the layer whether or not the contents exceed the layer's size. Specifically providing scroll bars avoids problems with them appearing and disappearing in a dynamic environment. This option works only in browsers that support scroll bars.
	Auto makes scroll bars appear only when the layer's contents exceed its boundaries.